<template>
  <a-card :bordered="false">
    <!-- 高级查询组件 -->
    <m-e-s-super-query
      :fieldList="queryObj"
      :saveCode="fileName"
      @ok="handleSuperQuery"
    ></m-e-s-super-query>
    <!-- table -->
    <v-table
      :toolbar="true"
      bordered
      ref="table"
      :data="loadData"
      :tableColumn="tableColumns"
    >
      <template v-slot:buttons>
        <a-button @click="addData" icon="plus" type="primary">新建</a-button>
        <a-button @click="showModal" icon="download" type="plain" style="margin-left: 12px">导入向导</a-button>
      </template>
      <template v-slot:status="{ text, row }">
        <a-tag color="#108ee9">{{ text | dictFilter(statusList) }}</a-tag>
      </template>
      <template v-slot:category="{ text, row }">
        {{ text | dictFilter(warehouseTypeList) }}
      </template>
      <template v-slot:locationManagement="{ text, row }">
        <a-tag color="#108ee9">{{ text | dictFilter(manageList) }}</a-tag>
      </template>
      <template v-slot:availableNum="{ text, row }">
        <a-tag color="#108ee9">{{ text | dictFilter(availableList) }}</a-tag>
      </template>
      <template v-slot:action="{ text, row }">
         <span>
          <a href="javascript:;" @click="showData(row)">查看</a>
        </span>
        <span>
          <a-divider type="vertical"/>
          <a href="javascript:;" @click="editData(row)">编辑</a>
        </span>
        <span>
          <a-divider type="vertical"/>
          <a-popconfirm title="是否删除" @confirm="deleteItem(row)" okText="是" cancelText="否">
            <a-icon slot="icon" type="question-circle-o" style="color: red"/>
            <a href="javascript:;" style="color: red">删除</a>
          </a-popconfirm>
        </span>
      </template>
    </v-table>
    <!-- form表单 -->
    <modal-form
      @ok="queryPage"
      ref="modalForm"
    />
    <!-- 导入 -->
    <b-import-file
      @ok="queryPage"
      :actionUrl="actionUrl"
      :des="des" ref="BImportFile"
      @download="download" />
  </a-card>
</template>

<script>
import { TableMixin } from '@/mixins/TableMixin'
import { superPageFetchList,delObj,downloadExcelCandidate } from '@api/mdm/warehouseBase'
import modalForm from './WarehouseAddOrUpdate'
import MESSuperQuery from '@comp/MesWSuperQuery/MesWSuperQuery'
import BImportFile from '@comp/BImportFile/BImportFile'
import {queryObj, tableColumns, statusList, manageList, availableList } from './warehouseBaseTemplate'
import { dictItemsDropDown } from '@api/sys/sys'
export default {
  name: "warehouseBaseList",
  mixins:[TableMixin],
  components:{
    MESSuperQuery,
    BImportFile,
    modalForm
  },
  data (){
    return {
      fileName: 'warehouseBaseList',
      queryObj,
      tableColumns,
      statusList,
      manageList,
      warehouseTypeList: [],
      // 导入接口
      actionUrl: '/mdm/warehouseBase/importExcel',
      des: ' <h3>说明</h3>\n' +
        '      <h4>请下载导入模板，填写完成后导入</h4>',
      availableList,
      queryParam: {},

      loadData: parameter => {
        return superPageFetchList(
          Object.assign(parameter, this.queryParam)
        ).then(res => {
          console.log(res.data)
          return res.data
        })

      }
    }
  },
  created() {
    // 获取仓库类型
    dictItemsDropDown('warehouse_type').then(res=>{
      this.warehouseTypeList = res.result
    })
  },
  methods: {
    // 查询
    handleSuperQuery (params) {
      this.queryParam.queryType = params.queryType
      this.queryParam.queryItems = encodeURI(JSON.stringify(params.queryItems))
      this.queryPage()
    },
    // 删除
    deleteItem (record) {
      delObj(record.id).then(res => {
        this.$message.info('删除成功')
        this.queryPage()
      })
    },
    //下载导入模板
    download () {
      downloadExcelCandidate().then(res => {
        const blbo = new Blob([res], { type: 'application/vnd.ms-excel;charset=utf-8' })
        var link = document.createElement('a')
        link.href = window.URL.createObjectURL(blbo)
        link.download = '仓库模板.xlsx'
        link.click()
      }).catch((e) => {
        this.$message.warning('下载失败')
      })
    }
  }
}
</script>

<style scoped>

</style>